<template>
	<div class="container">
		<ul class="items-list">
			<li v-for="(item,index) in options" @click="checkedState(index)">
				<span class="img"></span>
				<p class="text">{{item.name}}</p>
				<i class="checkIcon" :class="{'active':item.isShow}"></i>
				<input type="checkbox" class="mint-checkbox-input" v-model="item.isShow">
			</li>
		</ul>
		<div class="report-button">
			<mt-button size="large" type="danger" @click="distAgent">确认</mt-button>
		</div>
	</div>
</template>
<script>
	import { Toast } from 'mint-ui'
	export default {
		components:{
			
		},
		data () {
		    return {
		    	options:[],
		    	premisesId: window.sessionStorage.getItem(this.utilHelper.appAssistant+"_premisesId")
		    }
		},
		mounted: function() {
	       this.initPremisesList();
		}, 
		methods :{
			initPremisesList() {
				var _self = this;
				var body = {};
				body.params = {
					premisesId : _self.premisesId
				};
				var url = _self.utilHelper.apiUrl+'/api/getPartnerByPremises';
				_self.$http.post(url, body).then((response)=>{
					var data = response.body.resData;
					if(data.result==1){
						data.partnerList.forEach(function(item,index){
							_self.options.push({
				             	id: data.partnerList[index].partnerId,
				             	name: data.partnerList[index].accountName,
				             	isShow:false
							})
						})
					}else{
						Toast({
						  	message: '数据获取失败',
						  	position: 'middle',
						  	duration: 2000
						});
					}
				});
			},
			checkedState (chkIndex) {
				var _self = this;
				_self.options.forEach(function(option, index){
					if(chkIndex == index){
						_self.options[index].isShow = !_self.options[index].isShow;
					}else{
						_self.options[index].isShow = false;
						if(chkIndex == index){
							_self.options[index].isShow = !_self.options[index].isShow;
						}
					}
				});
			},
			distAgent (){
				var _self = this;
				var cusPreId = _self.$route.params.id;
				var partnerId = "";
				_self.options.forEach(function(option, index){
					if(_self.options[index].isShow == true){
						partnerId = _self.options[index].id;
					}
				});
				if(!partnerId){
					Toast({
					  	message: '请选择一个经纪人!',
					  	position: 'middle',
					  	duration: 2000
					});
					return false;
				}
				var params = {};
				params.userId = _self.userId;
				params.partnerId = partnerId;
				params.cusPreId = cusPreId;
				var url = _self.utilHelper.apiUrl+'/assistant/cuspre/distAgent.do';
				this.$http.post(url, params).then((response)=>{
					var body = response.body;
					var result = body.result;
					var errorMsg = body.errorMsg;
					if("1" == result){
						var instance = Toast('提交成功!');
						setTimeout(() => {
						  	instance.close();
						  	//跳转待分配列表
						  	var _self = this;
							_self.$router.replace({
								path: '/customerDetails/'+cusPreId
							})
						}, 3000);
					}else{
						var instance = Toast(errorMsg);
						setTimeout(() => {
						  	instance.close();
						}, 3000);
					}
				});
			}
		}
	}
</script>
<style scoped>
	.items-list{background-color: #fff;}
	.items-list li{height: 42px;line-height: 42px;padding: 0 30px 0 36px;width: 100%;position: relative;border-bottom: 1px solid #cdcdcd;}
	.items-list .img{position: absolute;left: 10px;top: 14px;width: 14px;height: 14px;background:url(../assets/images/checkImg.png) no-repeat;background-size: 14px auto;}

	.items-list .text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color: #333;}
	.checkIcon{position: absolute;right: 10px;width: 18px;height: 18px;background:url(../assets/images/checked.png) no-repeat;background-position: 0 0;background-size: 36px auto;top: 12px;}
	.checkIcon.active{background-position: -18px 0;}
	
	.report-button{padding: 0 10px;}
	.report-button .mint-button--danger{background-color: #eb6100;margin-top: 20px;}
</style>